<!-- /ApiBusiness/btransaction -->
<template>
	<view class="container">
		<uDatetimePicker class="example-body" placeholder="至" v-model="range" type="daterange" start-placeholder="开始日期"
			end-placeholder="结束日期" @change="dayChange" />

		<!-- 列表 -->
		<scroll-view scroll-y class="scroll-Y" @scrolltolower="lower">
			<!-- 左边 -->
			<view class="box" v-for="ele in data" :key="ele.id">
				<view class="left">
					<view class="">
						订单号：{{ele.order_id}}
					</view>
					<view class="time">
						{{ele.payment_time}}
					</view>
				</view>
				<!-- 右边 -->
				<view class="right">
					抽佣后：+{{ ' ' }}<text class="addMoney">{{ ele.amount?ele.amount:'0.00' }}</text>
				</view>
			</view>
		</scroll-view>
		<loading v-if="loading"></loading>
	</view>
</template>

<script>
	import uDatetimePicker from '../uni-datetime-picker_2.2.25/components/uni-datetime-picker/uni-datetime-picker.vue';
	var app = getApp();
	export default {
		data() {
			return {
				status: 1, // 状态
				page: 1, //当前页
				start_date: '', // 开始日期
				end_date: '', // 结束日期
				range: [],
				data: [], // 营业额列表

				loading: false,
				// total:null,  // 总页数
				// per_page:10,
				current_page: 1, // 当前页
				last_page: null,
			}
		},
		components: {
			uDatetimePicker
		},
		onLoad(opt) {
			this.getList()
		},
		methods: {
			// 获取商家订单数据
			getList() {
				let that = this
				let date = new Date(),
					year = date.getFullYear(), //获取完整的年份(4位)
					month = date.getMonth() + 1, //获取当前月份(0-11,0代表1月)
					strDate = date.getDate() // 获取当前日(1-31)
				if (month < 10) month = `0${month}` // 如果月份是个位数，在前面补0
				if (strDate < 10) strDate = `0${strDate}` // 如果日是个位数，在前面补0
				that.start_date = `${year}-${month}-${strDate}` // 设置默认日期为当天
				that.end_date = `${year}-${month}-${strDate}` // 设置默认日期为当天


				app.get('/ApiBusiness/btransaction', {
						aid: app.globalData.aid,
						platform: app.globalData.platform,
						session_id: app.globalData.session_id,
						// start_date:that.start_date,
						// end_date:that.end_date,
						page: that.page
					},
					function(res) {
						that.data = res.data.data
						that.current_page = res.data.current_page // 获取当前页
						that.last_page = res.data.last_page // 获取最后一页
					})
			},
			// 日期改变
			dayChange(e) {
				this.range = e
				this.start_date = this.range[0]
				this.end_date = this.range[1]
			},
			// 滚动到底部
			lower() {
				let that = this
				if (that.current_page == that.last_page) {
					uni.showToast({
						title: '没有更多数据了'
					})
					return
				}
				app.showLoading()
				that.per_page + 10
				that.page++
				app.get('/ApiBusiness/btransaction', {
						aid: app.globalData.aid,
						platform: app.globalData.platform,
						session_id: app.globalData.session_id,
						// start_date:that.start_date,
						// end_date:that.end_date,
						page: that.page
					},
					function(res) {
						that.data = [...that.data, ...res.data.data]
						that.total = res.data.total // 设置总页数
						that.current_page = res.data.current_page // 设置当前页
					})
				app.showLoading(false)
			}
		}
	}
</script>


<style lang="scss">
	.container {
		background-color: #fff;

		.example-body {
			padding: 10px;
		}

		.scroll-Y {
			height: calc(98vh - 20rpx);
			margin-top: 20rpx;
			display: flex;

			.box {
				width: 94vw;
				background-color: #fff;
				margin-top: 10px;
				border-radius: 8px;
				display: flex;
				justify-content: space-between;
				align-items: center;
				box-shadow: 0 2px 5px #CCCCCC;
				margin: 10px auto;
				padding: 20rpx;

				.left {
					.time {
						color: #808080;
						font-size: 14px;
					}
				}

				.right {
					.addMoney {
						color: red;
					}

				}
			}
		}

	}
</style>